/*
Author: W3layout
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
*/
 /* reset */
 html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
 article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
 ol,ul{list-style:none;margin:0;padding:0;}
 blockquote,q{quotes:none;}
 blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
 table{border-collapse:collapse;border-spacing:0;}
 /* start editing from here */
 a{text-decoration:none;}
 .txt-rt{text-align:right;}/* text align right */
 .txt-lt{text-align:left;}/* text align left */
 .txt-center{text-align:center;}/* text align center */
 .float-rt{float:right;}/* float right */
 .float-lt{float:left;}/* float left */
 .clear{clear:both;}/* clear float */
 .pos-relative{position:relative;}/* Position Relative */
 .pos-absolute{position:absolute;}/* Position Absolute */
 .vertical-base{	vertical-align:baseline;}/* vertical align baseline */
 .vertical-top{	vertical-align:top;}/* vertical align top */
 .underline{	padding-bottom:5px;	border-bottom: 1px solid #eee; margin:0 0 20px 0;}/* Add 5px bottom padding and a underline */
 nav.vertical ul li{	display:block;}/* vertical menu */
 nav.horizontal ul li{	display: inline-block;}/* horizontal menu */
 img{max-width:100%;}
 /*end reset*/
 body{
     font-family: 'Droid Sans', sans-serif;
     font-size:100%;
     background: url(../images/bg.jpg);
     background-repeat: no-repeat;
     background-attachment: fixed;
     background-position: center;
     background-size: cover;
 }
 .message.warning  {
     background: rgba(255, 255, 255, 0.33);
     -moz-box-shadow: 0 0 0 3px rgba(56, 41, 32, 0.25);
     -webkit-box-shadow: 0 0 0 3px rgba(56, 41, 32, 0.25);
     box-shadow: 0 0 0 3px rgba(56, 41, 32, 0.25);
      margin:9% auto 0;
     width: 26%;
 }
 .login-head {
     padding: 2em 0;
     background: #6D4A70;
     position:relative;
 }
 .login-head h1 {
     color: #fff;
     font-size: 1.5em;
     text-align: left;
     margin: 0 23px;
 }
 form {
     padding: 3em 2em;
     background: #F2F2F2;
     
 }
 form li{
     border: 2px ridge rgba(187, 185, 189, 0.11);
     border-radius: 0.3em;
     -webkit-border-radius:0.3em;
     -moz-border-radius:0.3em;
     -o-border-radius:0.3em;
     list-style:none;
     margin-bottom:12px;
     background:#F0EEF0;
 
 }
 .icon{
     background:url(../images/icons.png)  no-repeat 0px 0px;
     height:30px;
     width:30px;
     display: block;
     float: right;
     margin: 12px 9px 9px 0px;
 }
 .user{
     background: url(../images/icons.png) no-repeat 7px 1px;
     
 }
 .lock{
     background: url(../images/icons.png) no-repeat -22px 1px;
 }
 
 input[type="text"], input[type="password"] {
     font-family: 'Droid Sans', sans-serif;
     width:70%;
     padding: 0.5em 2em 0.5em 1em;
     color: #B8B8B8;
     font-size:20px;
     outline: none;
     background: none;
     border:none;
 }
 input[type="text"]:hover, input[type="password"]:hover{
     color:#9E61A3;
     
 }
 .submit h4 a{
     float:left;
     font-size: 16px;
     color: #999;
     font-weight: 400;
     font-family: 'Droid Sans', sans-serif;
     margin-top: 15px;
     margin-left: 21px;
 }
 .submit h4 a:hover{
     color:#8D4294;
 }
 /*************************/
 .submit{
     padding-top:3em;
 }
 input[type="submit"] {
     float: left;
     color: #fff;
     cursor: pointer;
     font-weight: 900;
     outline: none;
     font-family: 'Raleway', sans-serif;
     padding: 12px 0px;
     width: 35%;
     font-size: 18px;
     background:#6C496F;
     border:2px solid #6C496F;
     border-radius: 0.5em;
     -webkit-border-radius:0.5em;
     -moz-border-radius:0.5em;
     -o-border-radius:0.5em;
 }
 input[type="submit"]:hover {
     background: #fff;
     color:#6C496F;
     border:2px solid #6C496F;
 }
 /*----*/
 /* footer */
 .footer{
     position: absolute;
     bottom: 76px;
     left: 45%;
 }
 .footer p{
     position:relative;
     font-family: 'Droid Sans', sans-serif;
     color:#fff;
     display: block;
     font-size:1.2em;
     font-weight: 400;
     text-align:center;
     padding-top:2em;
 }
 .footer p a{
     color:#000;
     transition: all 0.5s ease-out;
     -webkit-transition: all 0.5s ease-out;
     -moz-transition: all 0.5s ease-out;
     -ms-transition: all 0.5s ease-out;
     -o-transition: all 0.5s ease-out;
 }
 .footer p a:hover{
     color:#fff
 }
 .message {
     box-shadow: 0 0 0 1px rgba(0,0,0,0.2) inset, 0 1px 0 rgba(255,255,255,0.1) inset, 0 1px 2px rgba(0,0,0,0.4);
     position: relative;
 }
 .warning {
     text-align: center;
     margin: 14% auto;
     width: 280px;
     background: rgba(82, 97, 97, 0.68);
     border-radius: 6px;
     -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
     -o-border-radius: 6px;
 }
 .alert-close {
     background: url('../imgs/into.png') no-repeat 0px 3px;
     cursor: pointer;
     height: 30px;
     position: absolute;
     right: 12px;
     top: 34px;
     -webkit-transition: color 0.2s ease-in-out;
     -moz-transition: color 0.2s ease-in-out;
     -o-transition: color 0.2s ease-in-out;
     transition: color 0.2s ease-in-out;
     width: 30px;
 }
 /*-----start-responsive-design------*/
 @media (max-width:1440px){
 .message.warning {
         margin: 11% auto 0;
         width: 30%;
     }
     .footer {
     left: 44%;
     }
 }
 @media (max-width:1366px){
     .message.warning{
         margin: 7% auto 0;
         width: 35%;
     }
     .footer {
         left: 43%;
         bottom: 9%;
     }
 }
 @media (max-width:1280px){
     .message.warning {
         margin: 7% auto 0;
         width: 33%;
     }
     .footer {
         left: 43%;
     }
 }
 @media (max-width:1024px){
     .message.warning{
         margin: 12% auto 0;
         width: 47%;
     }
     .footer {
         left: 41%;
     }
 }
 @media (max-width:768px){
     .message.warning{
         margin: 13% auto 0;
         width: 65%;
     }
     .footer {
         left: 38%;
         bottom:87px;
     }
 }
 @media (max-width:640px){
     .message.warning{
         margin: 13% auto 0;
         width: 67%;
     }
     .footer {
         left: 35%;
         bottom:87px;
     }
 }
 @media (max-width:480px){
     .message.warning  {
         margin: 15% auto 0;
         width:90%;
     }
     .footer {
         left: 33%;
         bottom: 136px;
     }
 }
 @media (max-width:320px){
     .message.warning  {
         margin:8% auto 0;
         width:90%;
     }
     .login-head {
     padding: 1.45em 0;
     }
     .login-head h1 {
     font-size: 1.15em;
     }
     .icon {
         margin: -33px 9px 9px 0px;
     }
     input[type="text"], input[type="password"] {
         font-size: 16px;
     }
     .alert-close {
     right: 12px;
     top: 22px;
     }
     form {
     padding: 1.5em 1.5em;
     }
     .submit {
     padding-top: 0.4em;
     }
     input[type="submit"] {
         float:none;
     padding: 11px 0px;
     width: 52%;
     font-size: 15px;
     }
     .submit h4 {
         margin-top: 15px;
         margin-bottom: 20px;
     }
     .submit h4 a {
     float: none;
     font-size: 15px;
     }
     .footer {
     left: 22%;
     bottom: 59px;
     }
     
 }